<template>
  <div class="mainWrap">
    <NavSideBar :chatMessageNum="chatMessageNum" @select="selectIconFun"/>
    <div class="containerBar">
      <router-view/>
    </div>
  </div>
</template>

<script type='text/ecmascript-6'>
import api from "@/api/index.js";
import NavSideBar from './NavSideBar.vue';
import util from '@/utils/index.js';
export default {
  components: {
    NavSideBar,
  },
  data() {
    return {
      chatMessageNum: 0
    };
  },
  mounted() { },
  sockets: {
    message(data) {
      const datas = { ...data };
      const _chatCode = datas.fromChatCode;
      datas.fromChatCode = datas.toChatCode;
      datas.toChatCode = _chatCode;
      datas.type = 1;

      // 自己发自己储存  储存发给别人的信息  储存发来的消息
      if (datas.toChatCode == JSON.parse(localStorage.userInfo).chatCode) {
        this.$store.commit('store_messageData', datas);
      }

      // 聊天列表数据
      const storeChatList = this.$store.state.chatList;

      // 如果消息是发给自己的
      if (datas.fromChatCode == JSON.parse(localStorage.userInfo).chatCode) {
        // 判断聊天列表中有没有发送者这个人
        var flag = false;
        const storeChatList = this.$store.state.chatList;
        let countNum = 0;
        let currentChatCode;
        storeChatList.forEach((element) => {
          // 如果存在这个人
          if (element.chatCode == datas.toChatCode) {
            flag = true;
            element.time = datas.time;
            element.chatTime = util.utilTime(datas.time);
            element.content = datas.content;

            // 未读计数++
            countNum = this.$store.state.chatNum[element.chatCode];
            countNum++;
            currentChatCode = element.chatCode;
          }
        })
        // 不存在这个人，在聊天列表创建
        if (!flag) {
          const params = {
            fromChatCode: JSON.parse(localStorage.userInfo).chatCode,
            toChatCode: datas.toChatCode
          }
          api.chatAdd(params).then((res) => {
            if (res.data.code == 0) {
              const message = { ...res.data.data };
              message.time = datas.time;
              message.chatTime = util.utilTime(datas.time);
              message.content = datas.content;

              // 未读计数++
              countNum++;
              currentChatCode = message.chatCode;

              this.$store.commit('store_chatList', message);
            }
          })
        }

        // 如果聊天窗口正处在发来信息者 --- 当前聊天界面
        if (datas.toChatCode == this.$route.query.chatCode) {
          const params = { ...datas };
          const currentChatUser = this.$store.state.currentChatUser;
          params.base = currentChatUser.base;
          params.toHeadImg = currentChatUser.headImg;
          params.toProvince = currentChatUser.province;
          params.toSex = currentChatUser.sex;
          params.toCity = currentChatUser.city;
          params.toTelephone = currentChatUser.telephone;
          params.toUserName = currentChatUser.userName;
          params.toUserProfile = currentChatUser.userProfile;
          params.toUserRemarks = currentChatUser.userRemarks;

          setTimeout(() => {
            this.$store.commit('store_currentChatData', params);
          }, 500);

          countNum = 0;
          currentChatCode = datas.toChatCode;
        }

        // 未读信息处理
        const store_chatNum = this.$store.state.chatNum;
        const _chatCode = {};
        console.log(currentChatCode, '未读信息chatCode');
        console.log(countNum, '未读信息countNum');
        for (const key in store_chatNum) {
          if (store_chatNum.hasOwnProperty(key)) {
            const element = store_chatNum[key];
            if (key == currentChatCode) {
              _chatCode[key] = countNum;
            } else {
              _chatCode[key] = element;
            }
          }
        }
        
        this.$store.commit('store_chatNum', _chatCode);
      }

      // 自己发送消息
      storeChatList.forEach((element) => {
        if (element.chatCode == datas.fromChatCode) {
          element.time = datas.time;
          element.chatTime = util.utilTime(datas.time);
          element.content = datas.content;
        }
      })

      // 按时间排序
      storeChatList.sort(function (a, b) {
        return (b.time || 0) - (a.time || 0);
      });
    }
  },
  methods: {
    selectIconFun(item) {
      this.$router.push({ name: item.name });
    }
  },
  watch: {
    "$store.state.chatNum": {
      handler: function (n, o) {
        console.log(n, '未读信息个数');
        this.chatMessageNum = 0;
        for (const key in n) {
          if (n.hasOwnProperty(key)) {
            const element = n[key];
            this.chatMessageNum += element;
          }
        }
      },
      deep: true
    }
  }
}
</script>

<style lang='scss' scoped>
.mainWrap {
  height: 100%;
  display: flex;
  .containerBar {
    flex: 1;
  }
}
</style>